import React from 'react';
import { inject, observer } from 'mobx-react';
import { displayTypes } from "../../../../constants/app";
import TaskViewExcel from './excel'
import TaskViewCustomPage from './cuspage'
@observer
export default class TaskPage extends React.Component{

    render() {
        const { store } = this.props;
        return(
        <div style={{ height:'100%',display: (store.selectedTab === 'page') ? "block": "none"}}>
            {this.renderPage()}
        </div>
        )

    }
    renderPage() {
        const { store } = this.props;
        if (store.displayType === displayTypes.EXCEL) {
            return this.renderExcel();
        } else {
            return this.renderCustomPage();
        }
    }
    renderExcel = () => {
        const { store ,browserStore} = this.props;
        return (
            <TaskViewExcel store={store.excel} browserStore ={browserStore} readonly={!store.canSubmit} />
        );
    }
    renderCustomPage = () => {
        const { store, loadCurPage } = this.props;
        return (
            <TaskViewCustomPage store={store.cuspage} loadCurPage={loadCurPage} />
        )
    }
    
}